import 'package:dotted_border/dotted_border.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:geomancy/enums/index.dart';
import 'package:geomancy/styles/index.dart';
import 'package:geomancy/tools/utils.dart';
import 'package:geomancy/widgets/common_text.dart';
import 'package:go_router/go_router.dart';

class DirectionGridWidget extends StatefulWidget {
  final bool isOpacity;
  final List<int> activeList;
  final CompassSource source;
  final double? direction;
  final String? zodiac;//属相
  final bool isSelf;
  const DirectionGridWidget({super.key, this.isOpacity = false, required this.activeList, required this.source, this.direction, this.zodiac, this.isSelf = false});

  @override
  State<DirectionGridWidget> createState() => _DirectionGridWidgetState();
}

class _DirectionGridWidgetState extends State<DirectionGridWidget> {
  final List directionList = [
    {
      'txtCN': '东南',
      'txtEN': 'southeast',
      'active': false
    },
    {
      'txtCN': '南',
      'txtEN': 'south',
      'active': false
    },
    {
      'txtCN': '西南',
      'txtEN': 'southwest',
      'active': false
    },
    {
      'txtCN': '正东',
      'txtEN': 'east',
      'active': false
    },
    {
      'txtCN': '中',
      'txtEN': 'middle',
      'active': false
    },
    {
      'txtCN': '西',
      'txtEN': 'west',
      'active': false
    },
    {
      'txtCN': '东北',
      'txtEN': 'northeast',
      'active': false
    },
    {
      'txtCN': '北',
      'txtEN': 'north',
      'active': false
    },
    {
      'txtCN': '西北',
      'txtEN': 'northwest',
      'active': false
    },
  ];
  late String sourceTxt;

  @override
  void initState() {
    super.initState();
    getSourceTxt();
    initData();
  }

  initData() {
    for(int i = 0; i < widget.activeList.length; i++) {
      directionList[widget.activeList[i]]['active'] = true;
    }
  }
  getSourceTxt() {
    switch (widget.source) {
      case CompassSource.roomWealth:
      case CompassSource.stationWealth:
        sourceTxt = 'wealth';
        break;
      case CompassSource.roomStudy:
      case CompassSource.stationStudy:
        if (widget.isSelf) {
          sourceTxt = 'station_study';
        } else {
          sourceTxt = 'room_study';
        }
        break;
      case CompassSource.roomRelations:
        sourceTxt = 'room_relations';
        break;
      case CompassSource.stationRelations:
        sourceTxt = 'station_relations';
        break;
      case CompassSource.health:
        sourceTxt = 'health';
        break;
      default:
        sourceTxt = 'wealth';
    }
  }

  goToDetail(int index) {
    Utils.shake();
    switch (widget.source) {
      case CompassSource.health:
        context.push('/health_time_maintenance');
        break;
      case CompassSource.roomWealth:
      case CompassSource.stationWealth:
        context.push('/wealth_result_detail', extra: {
          "source": widget.source,
          "direction": widget.direction,
          "index": index
        });
        break;
      case CompassSource.roomStudy:
      case CompassSource.stationStudy:
        ///本命文昌不可点击
        if (widget.isSelf) return;
        context.push('/study_result_detail', extra: {
          "source": widget.source,
          "direction": widget.direction,
          "index": index
        });
        break;
      case CompassSource.roomRelations:
      case CompassSource.stationRelations:
        context.push('/relations_result_detail', extra: {
          "source": widget.source,
          "direction": widget.direction,
          "index": index
        });
        break;
      default:
        break;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 670.w,
      height: 670.w,
      decoration: BoxDecoration(
        image: widget.isOpacity ? const DecorationImage(
          image: AssetImage('assets/icons/station_result_grid_bg.png'),
          fit: BoxFit.fill,
        ) : null
      ),
      child: GridView(
        physics: const NeverScrollableScrollPhysics(),
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3, //横轴三个子widget
          childAspectRatio: 1.0, //宽高比为1时，子widget
          mainAxisSpacing: 13.w,
          crossAxisSpacing: 13.w
        ),
        children: directionList.asMap().keys.map((index) {
          if (directionList[index]['active']) {
            return GestureDetector(
              onTap: () {
                goToDetail(index);
              },
              child: SizedBox(
                width: double.infinity,
                height: double.infinity,
                child: Image.asset('assets/grid/grid_${sourceTxt}_active_$index.png', fit: BoxFit.fill),
              ),
            );
          } else {
            return Container(
              key: ValueKey(index),
              child: DottedBorder(
                borderType: BorderType.RRect,
                strokeWidth: 4.w,
                dashPattern: [8.w, 6.w],
                color: ColorStyle.borderColor.withOpacity(widget.isOpacity ? 0.9 : 1),
                padding: EdgeInsets.all(2.w),
                customPath: (size) {
                  // 使用 RRect 创建不同圆角的路径
                  return Path()
                    ..addRRect(RRect.fromRectAndCorners(
                      Rect.fromLTWH(0, 0, size.width, size.height),
                      topLeft: Radius.circular(index == 0 ? 60.w : 20.w),
                      topRight: Radius.circular(index == 2 ? 60.w : 20.w),
                      bottomLeft: Radius.circular(index == 6 ? 60.w : 20.w),
                      bottomRight: Radius.circular(index == 8 ? 60.w : 20.w),
                    ));
                },
                child: Container(
                    width: double.infinity,
                    height: double.infinity,
                    decoration: BoxDecoration(
                        color: ColorStyle.themeLightColor.withOpacity(widget.isOpacity ? 0.3 : 1),
                        borderRadius: BorderRadius.only(
                          topLeft: Radius.circular(index == 0 ? 60.w : 20.w),
                          topRight: Radius.circular(index == 2 ? 60.w : 20.w),
                          bottomLeft: Radius.circular(index == 6 ? 60.w : 20.w),
                          bottomRight: Radius.circular(index == 8 ? 60.w : 20.w),
                        )
                    ),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Container(
                          margin: EdgeInsets.only(top: 4.w, right: 4.w),
                          child: Image.asset('assets/icons/direction_grid_left_icon.png', width: 10.6.w),
                        ),
                        Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            CommonText(txt: directionList[index]['txtCN'], weight: FontWeight.bold),
                            CommonText(txt: directionList[index]['txtEN'], fontSize: 18.sp,),
                          ],
                        ),
                        Container(
                          margin: EdgeInsets.only(top: 4.w, left: 4.w),
                          child: Image.asset('assets/icons/direction_grid_right_icon.png', width: 10.6.w),
                        ),
                      ],
                    )
                ),
              ),
            );
          }

        }).toList(),
      ),
    );
  }
}
